<gm:page title="Sample - JavaScript CRUD" authenticate="true">

  <!-- 
    The crud application demonstrates the using the JS API to perform CRUD 
    (Create, Retrieve, Update, Delete) operations on a feed in the datastore
    @author: GME Team
  -->

  <div class="gm-add-header">
    <h1>JavaScript CRUD</h1>
    Click one of the buttons below to perform an operation using the Google
    Mashup Editor's JavaScript API.
  </div>

  <gm:list id="myList" data="${app}/crud"/>

  <button onclick="create()">Create</button>
  <button onclick="read()">Read</button>
  <button onclick="update()">Update</button>
  <button onclick="del()">Delete</button>
 
  <script>
    var titleGPath = new GPath("atom:title");

    function create() {
      var myListData = google.mashups.getObjectById('myList').getData();
      var entry = myListData.createEntry();
      
      titleGPath.setValue(entry, prompt('Title:', ''));
      myListData.addEntry(entry);
    };

    function read() {
      var myListData = google.mashups.getObjectById('myList').getData();
      var entry = google.mashups.getObjectById('myList').getSelectedEntry();

      if (!entry) { 
        alert('Please select an item.');
        return;
      }

      alert(titleGPath.getValue(entry));
    };

    function update() {
      var myListData = google.mashups.getObjectById('myList').getData();
      var entry = google.mashups.getObjectById('myList').getSelectedEntry();
      
      if (!entry) {
        alert('Please select an item.');
        return;
      }
      
      titleGPath.setValue(entry, prompt('New title:', titleGPath.getValue(entry)));
      myListData.updateEntry(entry);
    };

    function del() {
      var myListData = google.mashups.getObjectById('myList').getData();
      var entry = google.mashups.getObjectById('myList').getSelectedEntry();
      
      if (!entry) {
        alert('Please select an item.');
        return;
      }
      
      myListData.removeEntry(entry);
    };
  </script>

</gm:page>
